import { lazy, Suspense } from 'react'
import { Navigate } from 'react-router-dom'

const Read = lazy(() => import('@/pages/Read'))
const Edit = lazy(() => import('@/pages/Edit'))
const Chatting = lazy(() => import('@/pages/Chatting'))
const NotFound = lazy(() => import('@/pages/NotFound'))

// 正在加载组件
function Loading() {
  return <h2 style={{ minHeight: '100vh' }}>Loading....</h2>
}

// 基本无权限路由
const routes = [
  {
    path: '/',
    // element: <Navigate to='/read' />,
  },
  {
    path: '/read/:harvestId?',
    element: (
      <Suspense fallback={<Loading />}>
        <Read />
      </Suspense>
    ),
  },
  {
    path: '/edit/:type?/:editId?',
    element: (
      <Suspense fallback={<Loading />}>
        <Edit />
      </Suspense>
    ),
  },
  {
    path: '/chatting',
    element: (
      <Suspense fallback={<Loading />}>
        <Chatting />
      </Suspense>
    ),
  },
  {
    path: '*',
    element: (
      <Suspense fallback={<Loading />}>
        <NotFound />
      </Suspense>
    ),
  },
]

// 创建可以操作路由表的方法
const createRoute = (func: Function) => {
  // console.log(routingTable, +'2333333')
  return func(routes)
}

// 默认导入一个可以操作路由表的方法，而不是直接导入路由表
export default createRoute
